<template>
	<view>
		<view class="edgeInsetTop"></view>
		<view class="wanlian">
			<image :src="$wanlshop.oss(iniData.logo)" mode="aspectFill"></image>
			<view class="text-bold text-xxl margin-top-lg">{{iniData.name}}</view>
			<view class="text-lg margin-top-xs wanl-gray">V{{version}}</view>
		</view>

		<view class="cu-list menu margin-xl">
			<view class="cu-item arrow" @tap="$wanlshop.to('/pages/user/feedback/feedback')">
				<view class="content">
					<text>{{$t('about-menu-sugge')}}</text>
				</view>
			</view>
			<!-- 版本更新&评分 后续版本更新 -->
			<view class="cu-item arrow">
				<view class="content" @tap="scoring">
					<text>{{$t('about-menu-mark')}}</text>
				</view>
			</view>
			<view class="cu-item arrow" @tap="update">
				<view class="content">
					<text>{{$t('about-menu-update')}}</text>
				</view>
			</view>
		</view>
		<view class="footer">
			<view class="margin-bottom text-orange">
				<text
					@tap="onDetails(common.appConfig.user_agreement, $t('about-below-userProtocol'))">《{{$t('about-below-userProtocol')}}》</text>
				<text class="text-black">和</text><text
					@tap="onDetails(common.appConfig.privacy_protection, $t('about-below-userProtocol'))">《{{$t('about-below-privacyProtocol2')}}》</text>
			</view>
			<view class="text-gray">{{iniData.name}} {{$t('about-below-copyright')}}</view>
			<view class="text-gray">Copyright © {{iniData.copyright}}</view>
		</view>
	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex';
	export default {
		data() {
			return {
				iniData: {
					name: '加载中...',
					logo: '',
					copyright: '',
					version: ''
				}
			};
		},
		onLoad() {
			this.loadData();
			uni.request({
				url: "/index/getversion",
				method: "POST",
				data: {},
				complete: (res) => {
					if (res.res.code == 1) {
						this.version = res.res.data.version
					}
				},
			});
		},
		computed: {
			...mapState(['common'])
		},
		methods: {
			async loadData() {
				await uni.request({
					url: '/wanlshop/common/about',
					success: res => {
						this.iniData = res.data;
					}
				});
			},
			// 评分
			scoring() {
				this.$wanlshop.msg(this.$t('about-toast-mark'));
			},
			// 更新
			update() {
				if (this.$store.state.update.update) {

				} else {
					this.$wanlshop.msg(this.$t('about-toast-update', {
						version: this.version
					}));
				}
			}
		}
	};
</script>

<style>
	page {
		background-color: #ffffff;
	}

	.wanlian {
		display: flex;
		align-items: center;
		/* 垂直居中 */
		justify-content: center;
		/* 水平居中 */
		flex-direction: column;
		padding-top: 80rpx;
		padding-bottom: 60rpx;
	}

	.wanlian>image {
		height: 130rpx;
		width: 130rpx;
	}

	.footer {
		display: flex;
		align-items: center;
		/* 垂直居中 */
		justify-content: center;
		/* 水平居中 */
		flex-direction: column;
		position: fixed;
		bottom: 100rpx;
		font-size: 24rpx;
		width: 100%;
	}
</style>